<template>
	<div class="reg">
    	<div class="HeadCodeLogin">
		    <div class="indexHead">
		        <p class="logo_box">
		            <a id="logo_url" >
		                <img class="h_logo" src="https://i3.letvimg.com/lc07_img/201605/26/17/19/CNlogo2x.png" />
		            </a>
		        </p>
		        <p class="f_title">一个帐号玩转所有乐视服务</p>
		    </div>
		</div>
		<div class="new_login">
        <div class="pad_box">
	            <ul class="comment1_text">
	                <li>
	                    <i class="icon IconPeople"></i>
	                    <span class="s_input_box"><input placeholder="请输入手机号" name="name" type="text" class="i_name"></span>
	                </li>
	                <li>
	                    <i class="icon IconPwd"></i>
		        		<span class="s_input_box"><input placeholder="6-16位字母/数字" name="pwd" type="password" class="i_pwd"></span>
	                    <u class="eye_box" @click="show()"><i></i></u>
	                </li>
	                <li>
	                	<input type="submit" value="注册" class="btn" name="type" @click="reg"/>
	                </li>
	            </ul>
        </div>
        <div class="posi_bottom">
            <!--切换语言 start-->
            <div class="language_area">
              	<span class="language">语言：<u class="text">简体中文</u></span>
              	<span class="area">国家/地区：<u class="text">中国</u></span>
            	<p class="service_tel">客服电话：<u><a href="tel:10109000">1 010 9000</a></u></p> 
            </div>      			
        </div>
    </div>
	</div>
</template>

<script>
export default {
  name: 'reg',
  data () {
    return {
      msg: 'mine_in'
    }
  },
  methods:{
  	reg:function(){
  		var _this = this;
		var pwd=$('.i_pwd').val();
		var name=$('.i_name').val();
		$.get("http://www.beautifulmelody.top/reg.php",{
			'name':name,
			'pwd':pwd,
			'type':'注册'
		},function(data){
			var data = JSON.parse(data);
			console.log(data.data);
			if(data.data =="success"){
				_this.$router.push({path:"/Mine_in"})
			}else{
				alert('用户名已存在');
			}
		})
  	},
  	show:function(){
  		$(".eye_box").click(function(){
			$('.i_pwd').attr("type","text")
  			console.log(111)
  		})
  	}
  }
}
</script>

<style scoped>
.reg{
	background: #fff;
}
.indexHead{
    padding-top: 0.6rem;
    color: #999;
    font-size: 0.35rem;
    text-align: center;
    position: relative;
}
#logo_url>img{
	width:25%;
}
.pad_box{
	padding: 0 0.6rem;
	margin:1rem 0 4rem 0;
}
.comment1_text li{
	border-bottom: 1px solid #d3d3d3;
  position: relative;
  margin-top: 0.6rem;
}
.icon{
	display: inline-block;
  float: left;
  width: 10%;
  height: 1rem;
  margin-right: 0.3rem;
  background: url(http://i3.letvimg.com/lc05_img/201611/23/12/08/icon/icon1x.png) no-repeat;
}
.IconPeople{
	background-position: 4px 1px;
}
.IconPwd{
	background-position: -198px 0px;
}
.s_input_box>input{
	  border:none;
    font-size: 0.4rem;
    color: #020202;
    background-color: #fff;
}
.eye_box{
	padding: 0.2rem;
  position: absolute;
  right: 0;
  top:-0.2rem;
}
.eye_box>i{
	display: inline-block;
	width: 0.78rem;
  height: 0.48rem;
	background: url(http://i3.letvimg.com/lc05_img/201611/23/12/08/icon/icon1x.png) no-repeat;
	background-position: -100px -301px;
}
.btn{
	background-color: #45abe5;
	margin-top: 0.5rem;
	width: 100%;
  	height: 1.3rem;
  	line-height: 1.05rem;
  	text-align: center;
}
.posi_bottom{
	width: 100%;
}
.regi_wz_box{
	text-align: center;
	font-size: 0.45rem;
}
.regi_more{
	margin-top: 0.6rem;
}
.regi_more_line{
	margin: 0 0.8rem;
  height: 15px;
  border-top: 1px solid #DBDBDB;
  position: relative;
  z-index: 0;
}
.regi_more_title{
	display: block;
  margin-top: -0.3rem;
  position: absolute;
  left: 50%;
  margin-left: -1.5rem;
  z-index: 10;
  width: 3rem;
  text-align: center;
  background: #fff;
}
.weixin_hide{
	display: flex;
  justify-content:space-around;
}
.li_list>.icon{
	display: block;
  width: 1.2rem;
  height: 1.2rem;
  margin: auto;
}
.qq>.icon{
	background: url(http://i1.letvimg.com/lc02_iscms/201601/08/17/00/9574f0c68c0a45e8be319cddbb988bba.png) no-repeat;
	background-size: auto 100%;
}
.weibo>.icon{
	background: url(http://i2.letvimg.com/lc04_iscms/201601/08/17/00/06f459f0af924694bc362a37b487fed4.png) no-repeat;
	background-size: auto 100%;
}
.i-a{
	display: block;
	height: 1.2rem;
}
.language_area{
	text-align: center;
  margin-top:0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.35rem;
  font-style: normal;
}
.language{
	margin-right: 1rem;
}
.service_tel{
  margin-top:0.4rem;
}
</style>